﻿// @import './mixins.scss';
// // 科技感色彩体系
// $tech-primary: #00f2fe;
// $tech-secondary: #4facfe;
// $tech-accent: #9d50bb;
// $tech-success: #00ff88;
// $tech-warning: #ffd166;
// $tech-error: #ff6b6b;

// $bg-dark: #0a0a0f;
// $bg-card: rgba(16, 18, 27, 0.8);
// $border-glow: rgba(79, 172, 254, 0.3);

// // 全局科技感样式
// .tech-theme {
//   background: linear-gradient(135deg, #0a0a0f 0%, #1a1a2e 50%, #16213e 100%);
//   min-height: 100vh;
//   color: #fff;
//   font-family: 'Orbitron', sans-serif;
  
//   // 科幻背景效果
//   &::before {
//     content: '';
//     position: fixed;
//     top: 0;
//     left: 0;
//     width: 100%;
//     height: 100%;
//     background: 
//       radial-gradient(circle at 20% 80%, rgba(79, 172, 254, 0.1) 0%, transparent 50%),
//       radial-gradient(circle at 80% 20%, rgba(157, 80, 187, 0.1) 0%, transparent 50%);
//     pointer-events: none;
//     z-index: -1;
//   }
// }

// // 玻璃拟态卡片
// .glass-card {
//   @include glass-morphism;
//   border: 1px solid $border-glow;
//   border-radius: 12px;
//   box-shadow: 
//     0 8px 32px rgba(0, 0, 0, 0.3),
//     inset 0 1px 0 rgba(255, 255, 255, 0.1);
  
//   &:hover {
//     border-color: $tech-primary;
//     @include neon-glow;
//   }
// }

// // 霓虹边框效果
// .neon-border {
//   position: relative;
  
//   &::before {
//     content: '';
//     position: absolute;
//     top: -2px;
//     left: -2px;
//     right: -2px;
//     bottom: -2px;
//     background: linear-gradient(45deg, $tech-primary, $tech-accent, $tech-secondary);
//     border-radius: 14px;
//     z-index: -1;
//     opacity: 0.7;
//     animation: neonGlow 3s ease-in-out infinite alternate;
//   }
// }

// @keyframes neonGlow {
//   from {
//     filter: blur(5px);
//     opacity: 0.5;
//   }
//   to {
//     filter: blur(8px);
//     opacity: 0.8;
//   }
// }

// // 数据流动画
// .data-flow {
//   position: relative;
//   overflow: hidden;
  
//   &::after {
//     content: '';
//     position: absolute;
//     top: -50%;
//     left: -50%;
//     width: 200%;
//     height: 200%;
//     background: linear-gradient(
//       45deg,
//       transparent 0%,
//       rgba(79, 172, 254, 0.1) 50%,
//       transparent 100%
//     );
//     animation: dataFlow 3s linear infinite;
//     transform: rotate(45deg);
//   }
// }

// @keyframes dataFlow {
//   0% {
//     transform: translateX(-100%) translateY(-100%) rotate(45deg);
//   }
//   100% {
//     transform: translateX(100%) translateY(100%) rotate(45deg);
//   }
// }

// // 文字渐变效果（修复兼容性）
// .gradient-text {
//   @include gradient-text(linear-gradient(45deg, #00f2fe, #9d50bb));
// }

// // 背景剪裁工具类
// .bg-clip-text {
//   background-clip: text;
//   -webkit-background-clip: text;
//   -moz-background-clip: text;
// }

// .text-fill-transparent {
//   -webkit-text-fill-color: transparent;
//   -moz-text-fill-color: transparent;
//   color: transparent;
// }
/* 临时使用普通CSS，等sass安装后再用Sass功能 */
.tech-theme {
  background: linear-gradient(135deg, #0a0a0f 0%, #1a1a2e 50%, #16213e 100%);
  min-height: 100vh;
  color: #fff;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.glass-card {
  background: rgba(16, 18, 27, 0.8);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(79, 172, 254, 0.3);
  border-radius: 12px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}

.neon-border {
  position: relative;
  border: 1px solid transparent;
  background: linear-gradient(135deg, rgba(79, 172, 254, 0.1), rgba(157, 80, 187, 0.1));
  border-radius: 12px;
}

.gradient-text {
  background: linear-gradient(45deg, #00f2fe, #9d50bb);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}